<template>
  <div class="page-container">
    <ShowList 
      :title="title" 
      :columns="columns" 
      :tableData="tableData" 
      :operation="operation"
      :total="total"
      :pageNum="queryParams.pageNum"
      :pageSize="queryParams.pageSize"
      @page-change="handlePageChange"
      @refresh="handleRefresh"
      @delete="handleDelete"
    />
  </div>
</template>

<script setup>
import { ref, onMounted, watch } from 'vue'
import { useRoute } from 'vue-router'
import ShowList from '@/components/ncpsy/ZSPT/Page123Vue/ShowList.vue'
import { listEvent, delEvent } from '@/api/ncpsy/management/event.js'
import { ElMessage, ElMessageBox } from 'element-plus'
import useUserStore from '@/store/modules/user'
const userStore = useUserStore()
const route = useRoute()
const title = ref('追溯事件列表')
const columns = ref([
  { prop: 'cropEventId', label: '序号', width: '80px', minWidth: '60px' },
  { prop: 'eventStartTime', label: '事件开始时间', width: '160px', minWidth: '140px' },
  { prop: 'eventEndTime', label: '事件结束时间', width: '160px', minWidth: '140px' },
  { prop: 'eventSummary', label: '事件摘要', minWidth: '200px', maxWidth: '300px' },
  { prop: 'cropId', label: '作物ID', width: '100px', minWidth: '80px' },
  { prop: 'overallStatus', label: '状态', width: '100px', minWidth: '80px' },
  { prop: 'cropEventId', label: '事件ID', width: '120px', minWidth: '100px' }
])
const tableData = ref([])
const total = ref(0)
const operation = ref([
  { label: '查看事件', action: 'completeArchive', type: 'primary' },
  { label: '记录事件', action: 'recordEvent', type: 'success' }
])

// 查询参数
const queryParams = ref({
  pageNum: 1,
  pageSize: 10,
  userId: userStore.id,
  cropId: null // 添加作物ID参数
})

// 获取事件列表数据
const getEventList = async () => {
  try {
    const response = await listEvent(queryParams.value)
    if (response.code === 200) {
      tableData.value = response.rows
      total.value = response.total
      console.log('追溯事件列表:', tableData.value)
    }
  } catch (error) {
    console.error('获取事件列表失败:', error)
  }
}

// 处理分页变化
const handlePageChange = (page) => {
  queryParams.value.pageNum = page
  getEventList()
}

// 处理刷新
const handleRefresh = () => {
  queryParams.value.pageNum = 1
  getEventList()
}

// 处理删除
const handleDelete = async ({ index, row }) => {
  try {
    await ElMessageBox.confirm(
      '确定要删除该事件记录吗？',
      '删除确认',
      {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }
    )
    
    await delEvent(row.cropEventId)
    ElMessage.success('删除成功')
    getEventList() // 重新加载数据
  } catch (error) {
    if (error !== 'cancel') {
      ElMessage.error('删除失败：' + (error.message || '未知错误'))
    }
  }
}

// 处理路由参数变化
const handleRouteParams = () => {
  // 检查路由参数中是否有cropId
  if (route.query.cropId) {
    queryParams.value.cropId = route.query.cropId
    title.value = `作物${route.query.cropId}的事件列表`
  } else {
    queryParams.value.cropId = null
    title.value = '追溯事件列表'
  }
}

// 监听路由参数变化
watch(() => route.query.cropId, (newCropId) => {
  handleRouteParams()
  getEventList()
})

// 组件挂载时获取数据
onMounted(() => {
  handleRouteParams()
  getEventList()
})
</script>

<style scoped>
.page-container {
  padding: 2px;
  background-color: #f5f7fa;
  min-height: calc(100vh - 84px);
}
</style>